<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>添加膳食信息</title>
		<style>

		</style>
		<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
	</head>

	<body>
		<article>
			<div class="span12">
				<ul class="breadcrumb">
					<li>
						<a href="#">主页</a> <span class="divider">/</span>
					</li>
					<li>
						<a href="selectbykey.html">膳食管理</a> <span class="divider">/</span>
					</li>
					<li class="active">
						<a href="selectbykey.html">膳食编辑</a> <span class="divider">/</span>
					</li>
				</ul>
			</div>
			</div>
			<div>
				<div class="row-fluid">
					<div class="span12">
						<form>
							<fieldset>
								<legend>增加膳食信息</legend>
								<form @submit.prevent="register">
									<label>护工<input type="text" v-model="params.aideId" /><a class="btn">查看</a> </label><br />
									<label>老人<input type="text" v-model="params.elderId"/><a class="btn">查看</a></label><br />
									<label>日期<input type="date" v-model="params.mealDate"/> /label><br />
									<label>餐点
									<select type="text" v-model="params.mealTime">
										<option value="早餐">早餐</option>
										<option value="午餐">午餐</option>
										<option value="晚餐">晚餐</option>
									</select>
								</label><br />
									<li style="list-style: none"><label>美食 <select type="text"
										v-model="params.foods">
											<option value="勺之最">请选择图片</option>
											<option value="勺之最">勺之最</option>
											<option value="草莓蛋糕">草莓蛋糕</option>
											<option value="匠心甜点">匠心甜点</option>
											<option value="酱肉丸子">酱肉丸子</option>
											<option value="酱香牛排">酱香牛排</option>
											<option value="腊肉排骨">腊肉排骨</option>
											<option value="卤味鸭掌">卤味鸭掌</option>
											<option value="绿豆奶">绿豆奶</option>
											<option value="麻辣豆腐">麻辣豆腐</option>
											<option value="牛肉羹">牛肉羹</option>
											<option value="清蒸大虾">清蒸大虾</option>
											<option value="水果沙拉">水果沙拉</option>
											<option value="小猪馒头">小猪馒头</option>
											<option value="美味煎饺">美味煎饺</option>
											<option value="小猫甜点">小猫甜点</option>
									</select>
								</label></li><br />
									<label>添加美食图片
									<select id="p1" onchange="picture()" type="text" v-model="params.foodImage">
									<option value="image/勺之最_副本.jpg">请选择图片</option>
									<option value="image/勺之最_副本.jpg">勺之最</option>
									<option value="image/草莓蛋糕_副本.jpg">草莓蛋糕</option>
									<option value="image/匠心甜点_副本.jpg">匠心甜点</option>	
									<option value="image/酱肉丸子_副本.jpg">酱肉丸子</option>	
									<option value="image/酱香牛排_副本.jpg">酱香牛排</option>	
									<option value="image/腊肉排骨_副本.jpg">腊肉排骨</option>	
									<option value="image/卤味鸭掌_副本.png">卤味鸭掌</option>	
									<option value="image/绿豆奶_副本.jpg">绿豆奶</option>	
									<option value="image/麻辣豆腐_副本.jpg">麻辣豆腐</option>	
									<option value="image/牛肉羹_副本.jpg">牛肉羹</option>	
									<option value="image/清蒸大虾_副本.jpg">清蒸大虾</option>	
									<option value="image/水果沙拉_副本.jpg">水果沙拉</option>
									<option value="image/小猪馒头_副本.jpg">小猪馒头</option>
									<option value="image/美味煎饺.jpg">美味煎饺</option>
									<option value="image/小猫甜点.jpg">小猫甜点</option>
									</select>
									<img id="p2"  />
								</label><br />
									<button @click="register()" type="submit" class="btn" :disabled="actionBtnDisabled">提交</button>
									<a href="selectbykey.html" class="btn">取消</a>
								</form>
							</fieldset>
						</form>
					</div>
				</div>
			</div>
		</article>
		<script src="http://code.jquery.com/jquery.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<script src="../../common/axios.min.js"></script>
		<script src="../../common/vue.js"></script>
		<script type="text/javascript" src="js/yi.toast.js"></script>
		<script type="text/javascript" src="js/yi.shakeit.js"></script>
		<script>
			const vm = new Vue({
				el: "body>article",
				data: {
					params: {},

					resp: {
						message: null
					},
					actionBtnDisabled: false
				},
				methods: {
					"register": function() {
						this.actionBtnDisabled = true;
						axios.post("/elderfood", this.params)
							.then(function(resp) {
								if(resp.code === "ok") {
									toast("膳食信息添加成功");
									setTimeout(function() {
										location.href = "selectbykey.html";
									}, 1500);

								} else {
									toast(resp.message);
								}
							}).finally(function() {
								vm.actionBtnDisabled = false;
							});
					}
				}
			});
			let picture = function() {
				document.getElementById("p2").src = document.getElementById("p1").value
			}
		</script>
	</body>

</html>